<template>
  <el-select v-model="value" v-bind="$attrs" collapse-tags value-key="country_id" clearable filterable @change="change">
    <el-option v-for="item in taskTypeOptions" :key="item.image_task_type_id" :label="item.tag_name" :value="item.image_task_type_id" />
  </el-select>
</template>
<script setup>
import useCommonStore from "@/store/modules/common";
const commonStore = useCommonStore();
const taskTypeOptions = computed(() => {
  if (!commonStore.taskTypeOptions) {
    commonStore.getTaskTypeList()
  }
  return commonStore.taskTypeOptions
});

const props = defineProps({
  modelValue: [String, Number, Array],
});

const value = computed({
  get: () => {
    return props.modelValue
  },
  set: (val) => {
    emit('update:modelValue', val);
  }
})

const emit = defineEmits(['update:modelValue', 'change'])
const change = (val) => {
  emit('update:modelValue', val);
}
</script>